<template>

  <div id="app-container" style="padding:30px;">
    <!-- 查询表单 -->
    <el-form :inline="true" class="demo-form-inline">
      <el-form-item>
        <el-input v-model="copyrightinQuery.copyrightName" placeholder="版权名" />
      </el-form-item>
      <el-form-item>
        <el-input v-model="copyrightinQuery.companyName" placeholder="公司名" />
      </el-form-item>
      <el-form-item>
        <el-input v-model="copyrightinQuery.remarkName" placeholder="备注名" />
      </el-form-item>
      <el-button type="primary" @click="query()">查询</el-button>
      <el-button type="primary" @click="reset()">清空</el-button>
      <router-link :to="'/copyrightin/copyrightin/create'">
        <el-button type="primary">添加版权</el-button>
      </router-link>
    </el-form>
  <el-table :data="copyrightinList" border fit highlight-current-row>
    <el-table-column label="序号" width="70" align="center">
      <template slot-scope="scope">
        {{ (pageNo - 1) * pageSize + scope.$index + 1 }}
      </template>
    </el-table-column>
    <el-table-column prop="copyrightName" label="版权名"/>
    <el-table-column prop="companyName" label="公司" />
    <el-table-column prop="remarkName" label="备注名" />
    <el-table-column prop="onlineNumber" label="上线数量" />
    <el-table-column prop="inlineNumber" label="未上线数量" />
    <el-table-column prop="endNumber" label="即将过期数量" />
    <el-table-column label="操作" align="center">
      <template slot-scope="scope">
        <el-button type="danger" size="mini" @click="deleteCopyrightin(scope.row.id, scope.row.status)">删除</el-button>
        <router-link :to="'/copyrightin/copyrightin/update/'+scope.row.id">
          <el-button type="primary" size="mini" >修改</el-button>
        </router-link>
        <router-link :to="'/copyrightin/copyrightin/ManList/'+scope.row.id">
          <el-button type="primary" size="mini" >管理客户</el-button>
        </router-link>
      </template>
    </el-table-column>
  </el-table>
  </div>
</template>


<script>
    import copyrightin from '@/api/copyrightin/copyrightin.js'

    export default {
      data() {
        return {
          copyrightinList: null,
          copyrightinQuery: {},
          total: 0,
          pageNo: 1,
          pageSize: 10,
          currentTime: ''
        }
      },
      created() {//在页面渲染之前，一般先调用methods定义的方法
        this.query()
      },
      methods: {//调用book.js定义的方法
        query(pageNo = 1) {
          this.pageNo = pageNo
          copyrightin.findPageCopyrightin(this.pageNo, this.pageSize, this.copyrightinQuery)
            .then(response => {
              this.copyrightinList = response.data.items
              console.log(this.copyrightinList)
              this.total = response.data.total
              this.currentTime = this.format(new Date(), 'yyyy-MM-dd HH:mm:ss')
            })
        },
        format(date, fmt) { // ## 格式化日期
          let o = {
            'M+': date.getMonth() + 1, // ## 月份
            'd+': date.getDate(), // ## 日
            'H+': date.getHours(), // ## 小时
            'm+': date.getMinutes(), // ## 分
            's+': date.getSeconds(), // ## 秒
            'q+': Math.floor((date.getMonth() + 3) / 3), // ## 季度
            'S': date.getMilliseconds() // ## 毫秒
          }
          if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
          for (let k in o)
            if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
          return fmt
        },
        reset(){
          this.copyrightinQuery={}
          this.query()
        },
        deleteCopyrightin(id, status) {
          if (status === 1) {
            this.$message({
              type: 'error',
              message: '该合同未失效'
            })
          } else {
            this.$confirm('此操作将永久删除该版权, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              copyrightin.deleteCopyrightin(id)
                .then(response => {
                  this.$message({
                    type: 'success',
                    message: '删除成功'
                  })
                  this.query()
                })
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消删除'
              })
            })
          }
        }
      }
    }
</script>

<style scoped>

</style>
